<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>28 - 解构赋值</title>
</head>
<body>
    <script>

        // 解构赋值     从数组或对象中取值的另外一种写法


        // 解构赋值     数组解构赋值  +  对象解构赋值


        




        // 从数组中取值之前有两种写法       通过索引  +  通过遍历

        let ary = [1, 2, 3];
        // 1. 数组解构赋值
        // 语法:     
        // ☛   let [变量1, 变量2, 变量3] = 数组;

        // 代码演示: 数组解构赋值
        let [num1, num2, num3] = ary;
        console.log(num1);
        console.log(num2);
        console.log(num3);





        // 从对象中取值之前有三种写法       对象.属性(键)  +  对象['属性(键)']  +  遍历

        let obj = {
            uname: 'zs',
            age: 23,
            height: 170
        }
        // 2. 对象解构赋值
        // 语法:     
        // ☛   let {属性名: 变量, 属性名: 变量} = 对象;

        // 代码演示: 对象解构赋值
        let {uname: a, age: b, height: c} = obj;
        console.log(a);
        console.log(b);
        console.log(c);

        // 对象解构赋值简单语法:
        // ☛   let {属性名, 属性名} = 对象;

        // 代码演示:
        let {uname, age, height, mylike} = obj;
        console.log(uname);
        console.log(age);
        console.log(height);
        console.log(mylike);    // undefined


    </script>
</body>
</html>